<template>
	<view>
		<!-- 用户已登录时显示的内容 -->
		<view v-if="isLoggedIn">
			<view class="op-cells"
				style="background-color: #ffffff; padding: 0 0 60rpx 0; overflow: hidden; text-align: center">
				<view style="margin-top: 40rpx">
					<view
						style="display: inline-block; width: 150rpx; height: 150rpx; border-radius: 200rpx; overflow: hidden">
						<block v-if="mine.avatar_url">
							<image :src="mine.avatar_url" style="width: 150rpx; height: 150rpx" />
						</block>
						<block v-else>
							<image src="../static/images/avatar.jpg" style="width: 150rpx; height: 150rpx" />
						</block>
					</view>
				</view>
				<view style="padding-top: 20rpx">
					<text class="user-nickname">{{ mine.nickname ? mine.nickname : '用户' + mine.nickname }}</text>
					<text>修改个人信息</text>
				</view>
			</view>

			<view class="weui-cells op-cells" style="margin-top: 20rpx">
				<view class="weui-cell">
					<view class="weui-cell__bd">我的订单</view>
					<view class="weui-cell__ft"><text @tap="toOrders()" style="font-size: 26rpx">全部</text></view>
				</view>
				<view class="weui-cell" style="padding: 10">
					<view class="data-cell" hover-class="weui-cell_active" @tap="toOrders(1)">
						<view class="data-icon">
							<image src="../static/images/od_30.png" mode="widthFix" />
						</view>
						<view class="data-txt">待接单</view>
						<text v-if="statistic.topays > 0"
							class="data-cell-hint data-cell-hint-red">{{ statistic.topays }}</text>
					</view>
					<view class="data-cell" hover-class="weui-cell_active" @tap="toOrders(2)">
						<view class="data-icon">
							<image src="../static/images/od_10.png" mode="widthFix" />
						</view>
						<view class="data-txt">待支付</view>
						<text v-if="statistic.topays > 0"
							class="data-cell-hint data-cell-hint-red">{{ statistic.topays }}</text>
					</view>
					<view class="weui-cell__bd">
						<view class="data-cell" hover-class="weui-cell_active"
							@tap="isLoggedIn ? toOrders(3) : handleLogin()">
							<view class="data-icon">
								<image src="../static/images/od_40.png" mode="widthFix" />
							</view>
							<view class="data-txt">待陪诊</view>
							<text v-if="statistic.todos > 0"
								class="data-cell-hint data-cell-hint-red">{{ statistic.todos }}</text>
						</view>
					</view>
					<view class="weui-cell__bd">
						<view class="data-cell" hover-class="weui-cell_active"
							@tap="isLoggedIn ? toOrders(4) : handleLogin()">
							<view class="data-icon">
								<image src="../static/images/od_20.png" mode="widthFix" />
							</view>
							<view class="data-txt">陪诊中</view>
							<text v-if="statistic.todos > 0"
								class="data-cell-hint data-cell-hint-red">{{ statistic.todos }}</text>
						</view>
					</view>
					<view class="weui-cell__bd">
						<view class="data-cell" hover-class="weui-cell_active"
							@tap="isLoggedIn ? toOrders(5) : handleLogin()">
							<view class="data-icon">
								<image src="../static/images/od_30.png" mode="widthFix" />
							</view>
							<view class="data-txt">已完成</view>
						</view>
					</view>
					<view class="weui-cell__bd">
						<view class="data-cell" hover-class="weui-cell_active"
							@tap="isLoggedIn ? toOrders(6) : handleLogin()">
							<view class="data-icon">
								<image src="../static/images/od_40.png" mode="widthFix" />
							</view>
							<view class="data-txt">已取消</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<!-- 用户未登录或登录过期时显示的内容 -->
		<view v-else style="text-align: center; margin-top: 50rpx;">
			<button @click="handleLogin">登录/注册</button>
		</view>

		<!-- 通用操作区域 -->
		<view class="weui-cells op-cells" style="margin-top: 20rpx">
			<!-- 接单 -->
			<view class="weui-cell weui-cell_access" hover-class="weui-cell_active" @click="takeOrder"
				v-if="isEscort && isLoggedIn">
				<view class="weui-cell__hd">
					<image src="../static/images/ic_clients.png"
						style="display: block; margin-right: 20rpx; width: 20px; height: 20px"></image>
				</view>
				<view class="weui-cell__bd">订单接取</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</view>
			<view class="weui-cell weui-cell_access" hover-class="weui-cell_active" @click="onClientChange"
				v-if="isLoggedIn">
				<view class="weui-cell__hd">
					<image src="../static/images/tab_pub.png"
						style="display: block; margin-right: 20rpx; width: 20px; height: 20px"></image>
				</view>
				<view class="weui-cell__bd">就诊人信息</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</view>
			<!-- 不是陪诊员则有成为陪诊员 -->
			<view class="weui-cell weui-cell_access" hover-class="weui-cell_active" @tap="onBecomeEscort"
				v-if="!isEscort && isLoggedIn">
				<view class="weui-cell__hd">
					<image src="../static/images/ic_staff.png"
						style="display: block; margin-right: 20rpx; width: 20px; height: 20px"></image>
				</view>
				<view class="weui-cell__bd">成为陪诊员</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</view>
			<!-- 陪诊员则有积分福利 -->
			<view class="weui-cell weui-cell_access" hover-class="weui-cell_active" @tap="onShowProduct"
				v-if="isEscort && isLoggedIn">
				<view class="weui-cell__hd">
					<image src="../static/images/ic_seller.png"
						style="display: block; margin-right: 20rpx; width: 20px; height: 20px"></image>
				</view>
				<view class="weui-cell__bd">积分福利</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</view>
			<view class="weui-cell weui-cell_access" hover-class="weui-cell_active" @tap="toggleAboutUs">
				<view class="weui-cell__hd">
					<image src="../static/images/ic_share.png"
						style="display: block; margin-right: 20rpx; width: 20px; height: 20px"></image>
				</view>
				<view class="weui-cell__bd">关于我们</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</view>
		</view>
		<share :shareModal="clone_shareModal"></share>
	</view>

	<!-- 模态框 -->
	<view ref="popup" class="modal-overlay" v-show="showModal">
		<view class="popup-content">
			<view class="popup-title">关于我们。。。</view>
			<button @tap="closeAboutUs">关闭</button>
		</view>
	</view>
</template>

<script setup>
	import {
		onLoad,
		onShow
	} from '@dcloudio/uni-app';
	import {
		ref
	} from 'vue';
	import {
		getUserInfoFromUserTap,
		myrequest
	} from '@/common/js/utils'; // 导入方法

	const app = getApp();
	const isLoggedIn = ref(false);
	const mine = ref({});
	const statistic = ref({});
	const isEscort = ref(false);
	const clone_shareModal = ref(false);
	const myPatients = ref([]);
	const showModal = ref(false);

	//用户点击按钮后触发此方法来获取用户信息并登录
	const handleLogin = () => {
		getUserInfoFromUserTap().then(userInfo => {
			if (userInfo) {
				// 是否是陪诊员
				if (userInfo.role === 2) {
					isEscort.value = true;
				}

				// 更新用户信息
				mine.value = {
					avatar_url: userInfo.avatarurl,
					nickname: userInfo.nickname
				};

				isLoggedIn.value = true;
			}
		}).catch(error => {
			console.error('登录失败', error);
			uni.showToast({
				title: '登录后查看！',
				icon: 'error'
			});
		});
	};

	const toOrders = (filt) => {
		if (!isLoggedIn.value) {
			handleLogin();
			return;
		}
		app.globalData.orders_filt = filt;
		uni.switchTab({
			url: '/pages/myorder/index'
		});
	};

	const showShareModal = () => {
		if (!isLoggedIn.value) {
			handleLogin();
			return;
		}
		clone_shareModal.value = true;
	};

	const onClientChange = () => {
		if (!isLoggedIn.value) {
			handleLogin();
			return;
		}
		uni.navigateTo({
			url: '../clients/index?act=edit'
		});
	};

	const takeOrder = () => {
		if (!isLoggedIn.value) {
			handleLogin();
			return;
		}
		uni.navigateTo({
			url: '../escort/onOrder'
		});
	};

	const onBecomeEscort = () => {
		if (!isLoggedIn.value) {
			handleLogin();
			return;
		}
		uni.navigateTo({
			url: './becomeEscort'
		});
	}

	const onShowProduct = () => {
		if (!isLoggedIn.value) {
			handleLogin();
			return;
		}
		uni.navigateTo({
			url: '../product/product'
		});
	}

	const toggleAboutUs = () => {
		showModal.value = true;
	};

	const closeAboutUs = () => {
		showModal.value = false;
	};

	onLoad(() => {
		checkLoginStatus();
	});

	onShow(() => {
		console.log("自动调接口消息接口");
		checkForUnreadNotificationsAndRelogin();
	});

	const checkLoginStatus = () => {
		const userInfo = uni.getStorageSync('userInfo');
		if (userInfo && Date.now() - userInfo.timestamp < 600000) { // 两天；；2分钟的时间戳差值120000
			isLoggedIn.value = true;
			mine.value = {
				avatar_url: userInfo.avatarurl,
				nickname: userInfo.nickname
			};
			if (userInfo.role === 2) {
				isEscort.value = true;
			}
		} else {
			uni.removeStorageSync('userInfo'); // 清除过期的缓存
			uni.removeStorageSync('token'); // 清除过期的缓存
			isLoggedIn.value = false;
			mine.value = {};
			uni.showToast({
				title: '登录状态已过期，请重新登录',
				icon: 'none',
				duration: 3000
			});
		}
	};

	const message = ref({});
	const checkForUnreadNotificationsAndRelogin = () => {
		app.globalData.utils.myrequest({
			myurl: '/message/query',
			method: 'GET',
			header: {
				'Authorization': uni.getStorageSync('token'),
				'Source-Platform': 'mini-program',
				'Content-Type': 'application/json'
			},
			mysuccess: res => {
				message.value = res.data;
				console.log('审核信息', res.data);
				// 检查是否有未读通知且 comment 字段有数据
				if (message && message.value.userId === uni.getStorageSync('userInfo').id && message.value.comment) {
					showMessageModal(message.value.comment);
				}
			},
			myfail: error => {
				console.error('审核信息接口调用失败', error);
			}
		});
	}

	// 显示消息弹框
	const showMessageModal = (comment) => {
		uni.showModal({
			title: '新消息',
			content: comment,
			success: function(res) {
				if (res.confirm) {
					uni.showToast({
						title: '正在重新登录···',
						icon: 'none',
						duration: 2000
					});
					handleLogin();
				} else if (res.cancel) {
					console.log('用户点击取消');
				}
			}
		});
	};
</script>

<style>
	@import url('index.css');
</style>